<template>
	<div class="app-container">
		<div>
      <p class="dialogTitle title">当前地震事件:
        <span v-if="currentEvent">{{ currentEvent.eventName }}</span>
        <span v-else>请在地震事件管理中设置当前地震事件</span>
      </p>
    </div>
    <el-row>
			<el-col :span="8">
				<div style="font-size: 16px;font-weight: bold;">
					<el-radio v-model="type" label="0" @change="changeType"><span></span></el-radio>1、通过上报数据汇总
				</div>
			</el-col>
		</el-row>	
		<el-row style="margin-top: 20px;margin-bottom: 10px;">
			<el-col :span="4">
				<div style="font-size: 14px;font-weight: bold;">&nbsp;&nbsp;企事业直接经济损失评估(万元)</div>
			</el-col>
			<el-col :span="10">
				<el-button type="primary" @click="handleSummary" :disabled="isEditSummary">汇总</el-button>
			</el-col>
		</el-row>

		<el-row :gutter="20">
			<el-col :span="18">
				<el-table v-loading="loading" :data="dataList">
					<el-table-column label="省市区县" align="center" prop="" >
						<template #default="scope">
							<span v-if="scope.row.province=='北京市'||scope.row.province=='天津市'||scope.row.province=='上海市'||scope.row.province=='重庆市'">{{scope.row.province}}{{scope.row.county}}</span>
              <span v-else>{{scope.row.province}}{{scope.row.city}}{{scope.row.county}}</span>
            </template>
          </el-table-column>
					<el-table-column label="企事业直接经济损失值(万元)" align="center" prop="loss" />					
				</el-table>
			</el-col>
			<!--<el-col :span="12">
				<el-table v-loading="loading" :data="dataList2">
					<el-table-column label="企事业名称" align="center" prop="enterpriseName" />
						
					<el-table-column label="企事业直接经济损失值" align="center" prop="loss" />					
				</el-table>
			</el-col>-->
		</el-row>
		<el-row style="margin-top: 20px;">
			<el-col :span="8">
				<div style="font-size: 16px;font-weight: bold;">
					<el-radio v-model="type" label="1" @change="changeType"><span></span></el-radio>2、通过房屋直接经济损失估算
				</div>
			</el-col>
		</el-row>	
		<el-row style="margin-top: 20px;">
			<el-col :span="10">
				<el-form :model="queryParams" ref="queryRef" :rules="rules" :inline="true" label-width="100px">
					<el-form-item label="计算系数" prop="countCoefficient">
						<el-input v-model="queryParams.countCoefficient" placeholeder="请输入计算系数" ></el-input>
					</el-form-item>

					<el-form-item>
						<el-button type="primary" @click="handleCount" :disabled="isEditCount">计算</el-button>
					</el-form-item>
				</el-form>
			</el-col>
		</el-row>
		<el-row>
			<el-col :span="18">
				<p>以评估子区分组显示</p>
				<el-table v-loading="loading1" :data="dataList1">
					<el-table-column label="评估子区" align="center" prop="evaluationSubareaName" />				
					<el-table-column label="企事业直接经济损失值(万元)" align="center" prop="loss" />
				</el-table>
			</el-col>
		</el-row>
		<el-row>
			<el-col :span="18">
				<p>以行政区划（省市县）分组显示</p>
				<el-table v-loading="loading1" :data="dataList3" stripe>
					<el-table-column label="省市县" align="center" prop="">
						<template #default="scope">
							<span v-if="scope.row.province=='北京市'||scope.row.province=='天津市'||scope.row.province=='上海市'||scope.row.province=='重庆市'">{{scope.row.province}}{{scope.row.county}}</span>
              				<span v-else>{{scope.row.province}}{{scope.row.city}}{{scope.row.county}}</span>
						</template>
					</el-table-column>				
					<el-table-column label="企事业直接经济损失值(万元)" align="center" prop="loss" />
				</el-table>
			</el-col>
		</el-row>
		<el-dialog title="计算公式" v-model="open" width="700px" append-to-body>
			<div style="font-size: 16px;">
				
			</div>
			<template #footer>
				<div class="dialog-footer">
					<el-button @click="open = false">关 闭</el-button>
				</div>
			</template>
		</el-dialog>
	</div>
</template>

<script setup name="Enterprises">
	import useEventStore from "@/store/modules/event";
	import { getAllList, getAllList1, getEvaluationSubArea, getDisasterAreasHousesData, checkData } from "@/api/directLossAssess/enterprises.js"
	const {
		proxy
	} = getCurrentInstance();
	const dataList = ref([]);
	const dataList1 = ref([]);
	const dataList2 = ref([]);
	const dataList3 = ref([]);
	const ids = ref();
	const type = ref("");
	const typeN = ref("");
	const isEditSummary = ref(true);
	const isEditCount = ref(true);
	const loading = ref(false);
	const loading1 = ref(false);
	const single = ref(true);
	const multiple = ref(true);
	const open = ref(false);
	const total = ref(0);
	const showSearch = ref(true);
	const currentEvent = computed(() => useEventStore().currentEvent);
	const option = ref([])
	// [0,1]数
	const positive0_1integer = (rule, value, callback) => {
	  value = String(value)
	  if (isNaN(value)|| !value) {
	    return callback(new Error());
	  }
	  var re = /^(1|0(\.\d{1,3})?)$/;
	  if (!re.test(value)) {
	    callback(new Error());
	  }else{
	    callback();
	  }
	}
	const data = reactive({
		queryParams: {
//			page: 1,
//			rows: 10,
			countCoefficient: "",			
		},
		form: {},
		rules: {
			countCoefficient:[{ required: true, message: "请输入[0,1]的数", trigger: "blur" , validator: positive0_1integer}],
		}
	})
	const {
		queryParams,
		form,
		rules
	} = toRefs(data)
	
	
	function changeType(type){
		if(type=="0"){
			typeN.value = "1";
			isEditSummary.value = false;
			isEditCount.value = true;
			queryParams.value.countCoefficient = "";
		}else{
			typeN.value = "0";
			isEditSummary.value = true;
			isEditCount.value = false;
		}
	}
	/** 汇总 */
	function handleSummary() {
    console.log(typeN.value)
		checkData(currentEvent.value.id).then(response => {
			if(response.data==null){
				getList();
			}else{
				proxy.$confirm(response.data,'系统提示',
				{confirmButtonText: '是',cancelButtonText: '否',type: 'warning'}).then(function() {
				}).then(() => {
					getList();
				}).catch(() => {
					
				});
			}				
		});		
	}
	//计算
	function handleCount() {
		proxy.$refs["queryRef"].validate(valid => {
	    if (valid) {
		    console.log(typeN.value)
	    	checkData(currentEvent.value.id).then(response => {
					if(response.data==null){
						getList1();
					}else{
						proxy.$confirm(response.data,'系统提示',
						{confirmButtonText: '是',cancelButtonText: '否',type: 'warning'}).then(function() {
						}).then(() => {
							getList1();
						}).catch(() => {
							
						});
					}						
				});	    	
	    }
	  })		
	}

	
	function getEvaluationSubAreaList() {
		getEvaluationSubArea(currentEvent.value.id).then(response => {
			if(response.data){

				if(response.data.type=="1"){
					dataList1.value = response.data.jisuan;
					dataList3.value = response.data.huizong2;
					type.value = "1";
					isEditSummary.value = true;
					isEditCount.value = false;
					queryParams.value.countCoefficient = response.data.jisuan[0].countCoefficient;
				}else{
					dataList.value = response.data.huizong1;
					//dataList2.value = response.data.huizong2;
					type.value = "0";
					isEditSummary.value = false;
					isEditCount.value = true;
				}
			}					
		});	
	}

	/** 查询数据列表 */
	function getList() {
		loading.value = true;
		getAllList({type: type.value,xsemId:currentEvent.value.id}).then(response => {			
			//dataList.value = response.data.huizong1 ? response.data.huizong1 : [];
			//dataList2.value = response.data.huizong2 ? response.data.huizong2 : [];
			//total.value = response.data.total;
			loading.value = false;
			// proxy.$modal.msgSuccess(response.message);
			dataList1.value = [];
			dataList3.value = [];
			getEvaluationSubAreaList();
		}).catch(err=>{loading.value = false;});
		
	}
		/** 查询数据列表 */
	function getList1() {
		loading1.value = true;
		getAllList1({...queryParams.value,xsemId:currentEvent.value.id,type:type.value}).then(response => {		
			//dataList1.value = response.data.jisuan ? response.data.jisuan : [];
			//total.value = response.data.total;
			loading1.value = false;
			proxy.$modal.msgSuccess(response.message);
			dataList.value = [];
			//dataList2.value = [];
			getEvaluationSubAreaList();
		}).catch(err=>{loading1.value = false;});
		
	}
	function objectSpanMethod({ row, column, rowIndex, columnIndex }) {
	 if (columnIndex === 0) {
		 const _row = setTable(dataList.value).one[rowIndex];
		 const _col = _row > 0 ? 1 : 0;
		 return {
			 rowspan: _row,
			 colspan: _col
		 };
	 }
//	 if (columnIndex === 1 ) {
//		 const _row = setTable(getData.value).two[rowIndex];
//		 const _col = _row > 0 ? 1 : 0;
//		 return {
//		 rowspan: _row,
//			 colspan: _col
//			};
//		}
//	 if (columnIndex === 3 ) {
//		 const _row = setTable(getData.value).three[rowIndex];
//		 const _col = _row > 0 ? 1 : 0;
//		 return {
//		 rowspan: _row,
//			 colspan: _col
//			};
//		}
//	 if (columnIndex === 4 ) {
//		 const _row = setTable(getData.value).four[rowIndex];
//		 const _col = _row > 0 ? 1 : 0;
//		 return {
//		 rowspan: _row,
//			 colspan: _col
//			};
//		}
}
	function setTable(tableData) {
		 let spanOneArr = [],
		 spanTwoArr = [],
		 spanThreeArr = [],
		 spanFourArr = [],
		 concatOne = 0,
		 concatTwo = 0,
		 concatThree = 0,
		 concatFour = 0;
		 tableData.forEach((item, index) => {
			 if (index === 0) {
				 spanOneArr.push(1);
				 spanTwoArr.push(1);
				 spanThreeArr.push(1);
				 spanFourArr.push(1);
			 } else {
				 if (item.evaluationSubareaName === tableData[index - 1].evaluationSubareaName) {
				 //第一列需合并相同内容的判断条件
					 spanOneArr[concatOne] += 1;
					 spanOneArr.push(0);
				 } else {
					 spanOneArr.push(1);
					 concatOne = index;
				 }
				 
	//			 if (item.longitude === tableData[index - 1].longitude) {
	//			 //第二列和需合并相同内容的判断条件
	//				 spanTwoArr[concatTwo] += 1;
	//				 spanTwoArr.push(0);
	//			 } else {
	//				 spanTwoArr.push(1);
	//				 concatTwo = index;
	//			 }
	//			 
	//			 if (item.latitude === tableData[index - 1].latitude) {
	//			 //第三列和需合并相同内容的判断条件
	//				 spanThreeArr[concatThree] += 1;
	//				 spanThreeArr.push(0);
	//			 } else {
	//				 spanThreeArr.push(1);
	//				 concatThree = index;
	//			 }
	//			 
	//			 if (item.macroPosition === tableData[index - 1].macroPosition) {
	//			 //第三列和需合并相同内容的判断条件
	//				 spanFourArr[concatFour] += 1;
	//				 spanFourArr.push(0);
	//			 } else {
	//				 spanFourArr.push(1);
	//				 concatFour = index;
	//			 }
			 }
		 });
	 	return {
			 one: spanOneArr,
			 two: spanTwoArr,
			 three: spanThreeArr,
			 four: spanFourArr,
	 	};
	}
	onMounted(() => {
		setTimeout(() => {
			getEvaluationSubAreaList();
		}, 200)
	})
</script>

<style scoped lang="scss">
	.title {
		margin: 0 0 20px !important;
	}
</style>